{% extends 'layout_html.html' %}
{% load static %}
{% load foundation_tags %}

{% block layout %}
<body class="{% get_settings 'PACE_COLOR' %} sidebar-mini layout-fixed control-sidebar-slide-open">
<div class="wrapper">
  <nav class="main-header navbar navbar-expand navbar-dark">
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link" data-widget="pushmenu" href="" role="button"><i class="fas fa-bars"></i></a>
      </li>
        {% menu_navbar %}
    </ul>
<ul class="navbar-nav ml-auto">
{% block right-navbar %}{% endblock %}
{% if request.user %}{% menu_user request.user %}{% endif %}
    <li class="nav-item">
        <a class="nav-link" data-widget="fullscreen" href="#" role="button">
          <i class="fas fa-expand-arrows-alt"></i>
        </a>
    </li>
</ul>
  </nav>

  <aside class="main-sidebar elevation-4 {% get_settings 'SIDEBAR_SKIN' %} sidebar-no-expand">
  {% block logo %}
    <a href="" class="brand-link text-center">
{#    <img src="itjielogo.png" alt="itjie Logo" class="brand-image img-circle elevation-3" style="opacity: .8">#}
      <span class="brand-text font-weight-light">{% get_settings 'SYSTEM_NAME' %}</span>
    </a>
  {% endblock %}

    <div class="sidebar">
        <div class="user-panel mt-3 pb-3 mb-3 d-flex">
{% block user-panel %}{% endblock %}
      </div>
      <nav class="mt-2">
<ul class="nav nav-pills nav-sidebar flex-column nav-flat nav-collapse-hide-child nav-child-indent"
            data-widget="treeview" role="menu" data-accordion="false" id="leftmenu">
{% block sidebar %}{% menu_main parent_menu current_menu %}{% endblock %}
        </ul>
      </nav>
    </div>
  </aside>

  <div class="content-wrapper  text-sm">
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6"><h1>{{ page_title }}</h1></div>
            <div class="col-sm-6">
                <ol class="breadcrumb float-sm-right">
                {% for items in breadcrumb %}
                    {% if items.active == True %}
                        <li class="breadcrumb-item active">{{ items.title }}</li>
                    {% else %}
                        <li class="breadcrumb-item"> <a href="{{ items.href}}">{{ items.title }}</a></li>
                    {% endif %}
                {% endfor %}</ol>
            </div>
        </div>
      </div>
    </section>

    <section class="content">
    <div class="container-fluid">
{% block page_content %}{% endblock %}
    </div>
    </section>
  </div>
</div>
</body>
{% endblock %}